<template>
    <a-drawer
            :visible="formVisible"
            :width="500"
            unmount-on-close
            :title="isEdit ? '编辑' : '新增'"
            @ok="submit"
            @cancel="handleCancel"

    >
        <div>
            <a-form
                    ref="formRef"
                    :model="form"
                    :label-col-props="{ span: 8 }"
                    :wrapper-col-props="{ span: 16 }"
            >
                <a-form-item field="version" label="版本号">
                    <a-input v-model="form.version" placeholder="请输入版本号"
                             :rules="[{required:true,message:'请输入版本号'}]"/>
                </a-form-item>

                <a-form-item field="version" label="版本号" >

                        <a-upload
                                action="/admin/cat_plate_version/add"
                                :headers="token"
                                :auto-upload="false"
                                ref="uploadRef"
                                @success="onSuccess"
                                multiple
                                #upload-button
                                :data="filesData"
                                name="blueprint"
                        >
                        </a-upload>
                </a-form-item>

            </a-form>
        </div>
    </a-drawer>
</template>

<script lang="ts" setup>
    import { ref, watch, computed ,defineProps } from 'vue';
    import { FieldRule, Message } from '@arco-design/web-vue';
    import {addPartInfo} from "@/api/part";
    import {
        addProductionInfo,
        contentTypeOptionsCatCircuitVersion,
        contentTypeOptionsCatPlateVersion
    } from "@/api/production";
    import {getToken} from "@/utils/auth";


    const props = defineProps({
        visible: {
            type: Boolean,
            default: false,
        },
        selected: {
            type: Number,
            default: 3,
        },
        refreshList: {
            type: Boolean,
            default: false,
        },
        formData: {
            type: Object,
            default: () => {
                return {};
            },
        },
    });

    const formRef = ref();//声明才能绑定，  ref="formRef"相当于一个标识可以调用或者检验form的内容

    // 初始数据
    const initData = () => {
        return {
            name: 'eeeeeeee',
        };
    };
    /**
     * 菜单数据
     */
    const form = ref(props.formData);
console.log(form);
    const selected = ref(props.selected);
    console.log(selected)






    const emit = defineEmits<{
        (e: 'update:visible', v: boolean): void;
        (e: 'refresh'): void;
    }>();
    const formVisible = ref(false);




    // 判断是编辑还是新增
    console.log(form.value.id);
    const isEdit = computed(() => !!form.value.id);
    console.log(isEdit);

    //分类钣金版本表id
    let contentTypeOptionsData=[];
    const fieldNames = {value: 'id', label: 'version_name'}
    const contentTypeOptions = async () => {
       const {data}=await contentTypeOptionsCatPlateVersion(selected);
        contentTypeOptionsData=data.data;

        console.log(contentTypeOptionsData)
    }
    contentTypeOptions();

    //分类电器版本表id
    let contentTypeOptionsDataCircuitVersion=[];
    const fieldNamesCircuitVersion = {value: 'id', label: 'version_name'}
    const contentTypeOptionsCircuit = async () => {
        const {data}=await contentTypeOptionsCatCircuitVersion();
        contentTypeOptionsDataCircuitVersion=data.data;

        console.log(contentTypeOptionsDataCircuitVersion)
    }
    contentTypeOptionsCircuit();

    const contentTypeOptions1 =  [
        {
            label: 'img',
            value: 'img',
        },
        {
            label: 'horizontalVideo',
            value: 'horizontalVideo',
        },
        {
            label: 'img',
            value: 'verticalVideo',
        },
    ];

    //上传文件
    let filesData={};
    const uploadRef = ref();
    const files = ref([]);
    const isload=ref(false);
    const token = {
        token: getToken(),
    };
    const onSuccess = (fileList) => {
      Message.success('添加分类电器版本成功');
        files.value = fileList;
    };const onError = (fileList) => {
      Message.error('添加分类电器版本失败');
    };
console.log(token)

    const submit = async () => {
        isload.value=true;
        formVisible.value = true;
        const validate = await formRef.value.validate();
        console.log(formRef.value);
        console.log(validate);

        if (!validate) {
            console.log(isEdit.value);
            if (isEdit.value) {
                console.log(form.value);
             console.log("修改成功 写修改api");
            } else {
                console.log(form.value);
                console.log(selected);
                const data={
                    cat_second_id:selected.value,
                    version:form.value.version,
                }
                console.log(data)
                filesData=data;
                console.log(filesData)
                uploadRef.value.submit();
                console.log(uploadRef.value.submit())
                console.log(uploadRef.value)

                // await addProductionInfo(data).then(()=>{
                //     Message.success("添加成功");
                // });
                console.log("添加成功");
            }
            console.log(initData);
            form.value = { ...initData };
            console.log(form.value);
            formVisible.value = false;
            emit('refresh');
        }
    };

    const handleCancel = () => {
        formVisible.value = false;
        form.value = { ...initData };
    };

    watch(
        () => formVisible.value,
        (val) => {
            emit('update:visible', val);
        }
    );

    watch(
        () => props.visible,
        (val) => {
            formVisible.value = val;
        }
    );

    watch(
        () => props.formData,
        (val) => {
            form.value = val;
        }
    );
    watch(
        () => props.selected,
        (val) => {
            selected.value = val;
        }
    );

</script>
